<!DOCTYPE html>
<html lang="en">
<title>订单管理</title>
<#import "/layout/layout.html" as body/>
<@body.page>

<style>
    a{
        color: #666;
    }
    .tcdPageCode {
        padding: 15px 20px;
        text-align: left;
        color: #ccc;
    }

    .tcdPageCode a {
        display: inline-block;
        color: #428bca;
        height: 25px;
        line-height: 25px;
        padding: 0 10px;
        border: 1px solid #ddd;
        margin: 0 2px;
        border-radius: 4px;
        vertical-align: middle;
    }

    .tcdPageCode a:hover {
        text-decoration: none;
        border: 1px solid #428bca;
    }

    .tcdPageCode span.current {
        display: inline-block;
        height: 25px;
        line-height: 25px;
        padding: 0 10px;
        margin: 0 2px;
        color: #fff;
        background-color: #428bca;
        border: 1px solid #428bca;
        border-radius: 4px;
        vertical-align: middle;
    }

    .tcdPageCode span.disabled {
        display: inline-block;
        height: 25px;
        line-height: 25px;
        padding: 0 10px;
        margin: 0 2px;
        color: #bfbfbf;
        background: #f2f2f2;
        border: 1px solid #bfbfbf;
        border-radius: 4px;
        vertical-align: middle;
    }

    .chosen-container {
        min-width: 160px !important;
    }
</style>
<div class="wrapper wrapper-content animated fadeIn">
    <div class="tabs-container">
        <ul class="nav nav-tabs" id="order_type">
            <li class="active"><a data-toggle="tab" href="#tab-1" aria-expanded="true" id="tt_class">储值卡订单管理</a></li>
        </ul>
        <div class="tab-content">
            <!-- 会员订单start -->
            <div id="tab-1" class="tab-pane active">
                <div class="panel-body">
                    <div class="wrapper wrapper-content animated fadeInRight">
                        <div class="row">
                            <div class="col-lg-12">
                                <div class="ibox float-e-margins">
                                    <div class="ibox-content">
                                        <form class="form-inline" action="to_user_account" role="form" id="form" method="post" accept-charset="UTF-8">
                                            <div class="form-group margin-left">
                                                <label for="tk_tradeId">用户id：</label>
                                                <input class="form-control" id="userId" name="userId" type="text" placeholder="" value="${userId!''}"/>
                                            </div>
                                            <div class="form-group margin-left">
                                                <label for="tk_tradeId">用户手机号码：</label>
                                                <input class="form-control" id="mobile" name="mobile" type="text" placeholder="" value="${mobile!''}"/>
                                            </div>
                                             <div class="form-group date-rangepicker">
                                                <label for="daterange">日期：</label>
                                                <input class="form-control" id="pay_time" type="text" name="pay_time" value="${pay_time!''}" style="width: 188px"/>
                                            </div>
                                            <div class="form-group margin-left">
												<label for="status">状态：</label> 
												<select class="form-control" id="payStatus" name="payStatus">
													<option value="all" <#if payStatus??&&payStatus == 'all'>selected="true"</#if> >全部</option>
                                                    <option value="已付款" <#if payStatus??&&payStatus == '已付款'>selected="true"</#if>>已付款</option>
                                                    <option value="未付款" <#if payStatus??&&payStatus == '未付款'>selected="true"</#if>>未付款</option>
                                                    <option value="付款中" <#if payStatus??&&payStatus == '付款中'>selected="true"</#if>>付款中</option>
                                                    <option value="已兑换" <#if payStatus??&&payStatus == '已兑换'>selected="true"</#if>>已兑换</option>
												</select>
											</div>
											<div class="form-group margin-left">
												<label for="status">类型：</label> 
												<select class="form-control" id="viptype" name="viptype">
													<option value="0" <#if vipType??&&vipType == 0>selected="true"</#if> >全部</option>
													<option value="1" <#if vipType??&&vipType == 1>selected="true"</#if>>新增</option>
                                                    <option value="2" <#if vipType??&&vipType == 2>selected="true"</#if>>续费</option>
                                                    
												</select>
											</div>
                                            <button type="button" class="btn btn-outline btn-primary" style="margin-top: 5px" id="but_submit">确认</button>
											<!-- mode start -->
											<input type="hidden" id="pageNo" name ="pageNo" value="1">
                                        </form>
                                        <hr>
                                        <div class="table-responsive">
                                            <!-- dataTables-example -->
                                            <table class="table table-hover table-center dataTables-example">
                                                <thead>
                                                <tr>
                                                    <th>用户id</th>
                                                    <th>用户昵称</th>
                                                    <th>手机号码</th>
                                                   	<th>创建时间</th>
                                                   	<th>订单号/兑换码</th>
                                                   	<th>充值方式</th>
                                                   	<th>充值金额</th>
                                                   	<th>实到金额</th>
                                                   	<th>类型</th>
                                                   	<th>状态</th>
                                                   	<th>查看</th>
                                                </tr>
                                                </thead>
                                                <!-- 页面加载的数据  -->
                                                <tbody id="td1">
                                                    <#if list??> <#list list as list>
														<tr>
															<td>${list.user_id!}</td>
															<td>${list.nick_name!}</td>
															<td>${list.mobile!}</td>
															<td>${list.create_time?date}</td>
		                                                   	<td>${list.change_code!}</td>
		                                                   	<td>${list.recharge_type!}</td>
		                                                   	<td>${list.face_amt!}</td>
		                                                   	<td>${list.actual_amt!}</td>
		                                                   	<td>${list.accountType!}</td>
		                                                   	<td>${list.payStatus!}</td>
		                                                   	<td><a href='${baseUrl}/system/cashcard/to_consume_list?userId=${list.user_id!}&type=2' class='btn btn-default'><i class='fa fa-folder-open'></i> 消费记录</a></td>
														</tr>
													</#list> </#if>
                                                </tfoot>
                                            </table>
                                        </div>
                                    </div>
                                    <div class="ibox-footer overflow" id="tk_dibu">
                                        <h4 class="pull-left margin-left" id="tk_tongji" style="color: #2fb146 ">订单合计：${pageCount!}笔</h4>
                                        <h4 class="pull-left margin-left" id="tk_feiyong" style="color: #2fb146 ;margin-left:20px;">充值金额：¥${allXF!}</h4>
                                        <h4 class="pull-left" id="tk_shifu" style="color: #2fb146;margin-left:20px; ">实到金额：¥${allSF!}</h4>
                                        <div class="pull-right copot-page" id="copot-page"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- 团课end -->
            
        </div>
    </div>
</div>

<input type="hidden" id="baseUrl" value="${baseUrl}">
<!-- mode end  -->

<link href="${baseUrl}css/plugins/clockpicker/clockpicker.css" rel="stylesheet">
<script src="${baseUrl}js/main.js"></script>
<script src="${baseUrl}js/plugins/clockpicker/clockpicker.js"></script>
<script src="https://cdn.bootcss.com/bootstrap-modal/2.2.6/js/bootstrap-modal.js"></script>
<script>
   
    $(document).ready(function () {
    	//时间选择
        $('input[name="pay_time"]').daterangepicker({
            startDate: moment().startOf('day'),
            endDate: moment(),
            //minDate: '01/01/2012',    //最小时间
            //maxDate: moment(), //最大时间
            dateLimit: {days: 365}, //起止时间的最大间隔
            showDropdowns: true,
            showWeekNumbers: false, //是否显示第几周
            timePicker: false, //是否显示小时和分钟
            timePickerIncrement: 60, //时间的增量，单位为分钟
            timePicker12Hour: false, //是否使用12小时制来显示时间
            ranges: {
                //'最近1小时': [moment().subtract('hours',1), moment()],
                '今日': [moment().startOf('day'), moment()],
                '昨日': [moment().subtract('days', 1).startOf('day'), moment().subtract('days', 1).endOf('day')],
                '最近7日': [moment().subtract('days', 6), moment()],
                '最近30日': [moment().subtract('days', 365), moment()]
            },
            opens: 'right', //日期选择框的弹出位置
            buttonClasses: ['btn btn-default'],
            applyClass: 'btn-small btn-primary blue',
            cancelClass: 'btn-small',
            format: 'YYYY-MM-DD', //控件中from和to 显示的日期格式 YYYY-MM-DD HH:mm:ss
            separator: '~',
            locale: {
                applyLabel: '确定',
                cancelLabel: '取消',
                fromLabel: '起始时间',
                toLabel: '结束时间',
                customRangeLabel: '自定义',
                daysOfWeek: ['日', '一', '二', '三', '四', '五', '六'],
                monthNames: ['一月', '二月', '三月', '四月', '五月', '六月',
                    '七月', '八月', '九月', '十月', '十一月', '十二月'],
                firstDay: 1
            }
        }, function (start, end, label) {//格式化日期显示框
            $('.date-rangepicker span').html(start.format('YYYY-MM-DD HH:mm:ss') + ' - ' + end.format('YYYY-MM-DD HH:mm:ss'));
        });
    	
    	new Page({
            parent: $("#copot-page"),
            nowPage: ${pageNum!},
            pageSize: 10,
            totalCount: ${pageCount!},
            setting: {
                defaultPage: 7,
                firstPageText: "首页",
                prevPageText: "上一页",
                nextPageText: "下一页",
                lastPageText: "尾页"
            },
            callback: function (nowPage, totalPage) {
            	nowPage = nowPage == 0?1:nowPage;
            	$("#pageNo").val(nowPage);
           	 	$("#form").submit();
            }
        });
    	
        
        $("#but_submit").click(function(){
        	$("#form").submit();
        });
		
		$("#hy_export").click(function(){
			var columnName = '用户id,用户昵称,手机号码,下单时间,支付时间,购买月数,支付金额,会员有效开始时间,会员有效结束时间,状态';
			var keys = 'user_id,nick_name,mobile,created_time,pay_time,type,amount,vip_start_time,vip_end_time,pay_status';
			window.location = 'execl_order_tk.action?columnName=' + columnName + "&key=" + keys+"&type="+5; 
		});

    });

</script>

</@body.page>
</html>